<template>
  <div>
   		<weuiHeader theme="订单确认"></weuiHeader>

	<div class="order-confirm">
		<div class="tablecode">
			<p class="float-left">桌号</p>
			<p class="float-right">{{ tableName }}</p>
		</div>

	<!-- 菜品列表 -->
	<div class="dishes-content">
		<div class="total-clean">
			<div class="bottom-line">
				<p class="float-left">已点菜品 ({{ total }}份)</p>
				<p class="float-right" @click="ask()">
					<i class="icon-x icon-x9"></i>&nbsp;<span style="vertical-align: middle;">清空</span>
				</p>
			</div>
		</div>

		<div class="dishes-item">
			<div class="bottom-line">
				<ul v-for="item in menuList">
					<li style="width:60%" class="text-overflow">{{ item.itemName }}</li>
					<li class="text-center" style="width:20%">x{{ item.number }}</li>
					<li class="text-right" style="width:20%">¥{{ (item.money * item.number).toFixed(2)}}</li>
				</ul>
			</div>
		</div>

		<!-- 餐具费 -->
		<div class="dishes-item" v-if="showService">
			<div class="bottom-line">
				<ul v-for="service in serviceCharges">
					<li style="width:80%">{{ service.chargeName }}</li>
					<li class="text-right" style="width:20%">¥{{ service.money }}</li>
				</ul>
			</div>
		</div>

		 <!-- 优惠信息 -->
		<div class="discount-info bottom-line" v-if="hasDiscount">
			<p class="float-left">
			 	<img src='../images/discount_icon.png' class="discount-icon">
			 	&nbsp;<span class="col999">{{discountContent}}</span>
			 </p>
			 <p class="float-right">- ¥{{discountNum}}</p>
		</div>

		<!-- 合计 -->
		<div class="total-count">
			<p class="float-left">
				<span>合计 ¥{{totalPriceOrigin.toFixed(2)}}</span> &nbsp;
				<span class="col999" v-show="hasDiscount">优惠 ¥{{discountNum}}</span>
			</p>
			<p class="float-right">应付 <span style="color:#f97432;font-size: 17px;">¥{{totalPrice.toFixed(2)}}</span></p>
		</div>
	</div>
	<!-- 订单备注 -->
	<div class="order-remark">
		<div class="bottom-line" style="height: auto">
			<div class="remark-title">订单备注</div>
		</div>

		<div class="taste-options">
			<ul>
				<li class="group-select">
					<span id="option1" class="group-option" @click="selectHot('nohot')" :class="{'current-hot': hot == 'nohot'}">不要辣</span>
					<span id="option2" class="group-option" @click="selectHot('littleHot')" :class="{'current-hot': hot == 'littleHot'}">少放辣</span>
					<span id="option3" class="group-option" @click="selectHot('moreHot')" :class="{'current-hot': hot == 'moreHot'}">多放辣</span>
					<span class="vertical-line" id="line1" :class="{'current-hot': hot == 'nohot' || hot == 'littleHot'}"></span>
					<span class="vertical-line" id="line2" :class="{'current-hot': hot == 'littleHot' || hot == 'moreHot'}"></span>
				</li>
				<li style="margin-right: 0;"><button type="button" @click="selectTaste('soySauce')" :class="{'current-taste': isSoySauce}">少放酱油</button></li>
			</ul>

			<ul class="clearfix mt10">
				<li><button type="button" @click="selectTaste('salt')" :class="{'current-taste': isSalt}">少放盐</button></li>
				<li><button type="button" @click="selectTaste('vinegar')" :class="{'current-taste': isVinegar}">多点醋</button></li>
				<li><button type="button" @click="selectTaste('coriander')" :class="{'current-taste': isCoriander}">不要香菜</button></li>
				<li><button type="button" @click="selectTaste('onion')" :class="{'current-taste': isOnion}">不要洋葱</button></li>
			</ul>
		</div>

		<div class="other-demand">
			<input type="text" placeholder="其他偏好或要求" class="custom-input" maxlength="50" v-model="remarkInput">
		</div>

	</div>

	<!-- 是否需要发票 -->
	<div class="invoice" v-if="showInvoice">
		<div class="invoice-switch bottom-line">
			<p class="float-left">是否需要发票</p>
			<div class="float-right" style="padding-top:10px;">
				<!-- <div class="switch" :class="{'switch-close': isClose,'switch-open':isOpen}" @click="switchInvoice()"></div> -->
				<mt-switch v-model="showInvoiceWrite" @click="switchInvoice()"></mt-switch>
			</div>
		</div>

		<!-- 填写发票信息 -->
		<div class="invoice-write" v-show="showInvoiceWrite">
			<div class="invoice-type">
				<span style="margin-right:30px;">类型: </span>
				<div @click="selectType()"  v-if="supportPaper" style="margin-right:30px;"><div class="option" :class="{'type-tick': isPaper,'type-circle':!isPaper}"></div> &nbsp;<span>纸质</span></div>
				<div @click="selectType2()"><div class="option" :class="{'type-tick': isEtc,'type-circle':!isEtc}"></div> &nbsp;<span>电子</span></div>
			</div>
			<div class="invoice-type">
				<span style="margin-right:30px;">抬头: </span>
				<div @click="selectTitle()" v-if="supportEtc" style="margin-right:30px;"><div class="option" :class="{'type-tick': isCom,'type-circle':!isCom}"></div> &nbsp;<span>公司</span></div>
				<div @click="selectTitle2()"><div class="option" :class="{'type-tick': isPerson,'type-circle':!isPerson}"></div> &nbsp;<span>个人</span></div>
			</div>
			<input type="text" placeholder="请输入发票信息" class="custom-input" maxlength="30" v-model="invoiceHeader" v-show="isCom == true">
			<input type="text" placeholder="请输入邮箱" class="custom-input mt10" maxlength="50" v-model="email" v-show="isEtc== true">
		</div>

	</div>

	 <!-- 微信支付 -->
	 <div class="weixin-pay">
	 	<div class="float-left" style="padding-top: 8px;">
	 		<p class="font13">应付 &nbsp;<span style="font-size: 18px;color:#f96132;">¥{{totalPrice.toFixed(2)}}</span></p>
	 		<p class="font12 col999">已点{{total}}份</p>
	 	</div>
	 	<div class="float-right" style="line-height: 50px;">
 			<button type="button" class="pay-btn" @click="showTip()">微信支付</button>
	 	</div>

	 </div>


	 <!-- 清除菜单模态框 -->
	 <cleanCart ref="cleanCart"></cleanCart>

	 <!-- 支付点完成提示框 -->
   <!-- 此处有bug 7.11修改 -->
	<div class="pay-finish-dialog" v-show="showTipDialog == true">
		<div class="title">
			<div class="title-line"></div>
			<div class="title-tip">温馨提示</div>
			<div class="title-line"></div>
		</div>

		<img src="../images/pay_finish_tip.png" class="pay-finish-tip">

		<button type='button' class="dialog-btn" @click="weixinPay()" :disabled="start">我知道了</button>

	</div>
	<div class="bg-layer" v-show="showTipDialog == true"></div>

</div>

  </div>
</template>

<script type="text/ecmascript-6">
	import weuiHeader from '../components/weuiHeader';
	import cleanCart from '../components/cleanCart';
    import Vue from 'vue'
    import { Switch} from 'mint-ui';
    import {Toast} from 'mint-ui';
    Vue.component(Switch.name, Switch);
    Vue.component(Toast.name, Toast);

   const SUCCESS = 200;
    export default {
      data() {
      	  const tableName = window.localStorage.getItem('tableName');
          return {
          	tableName: tableName,
          	total: 0, //菜品份数
          	totalPrice: 0, //总价
          	totalPriceOrigin:0,
          	menuList: [], //菜品列表
          	hasDiscount:false, //是否有优惠
          	discountContent:"",  //活动内容
          	discountNum:0,  //优惠金额
          	isSoySauce:false, //酱油
          	isSalt:false, //盐
          	isVinegar:false, //醋
          	isCoriander:false, //香菜
          	isOnion:false, //洋葱
          	hot:null, //辣
          	showInvoice:false,
          	showInvoiceWrite:false,
          	isClose:true,
          	isOpen:false,
          	isPaper:true,
          	isEtc:false,
          	supportPaper:true,
          	supportEtc:true,
          	isCom:true,
          	isPerson:false,
          	showService:false,
          	serviceCharges:[],
          	serviceMoney:0,
          	invoiceHeader:"",
          	email:"",
          	remarkInput:"",
          	remarkAllStr:"",
          	activeType:null,
          	showTipDialog:false,
            paidMoney:0,
            start: false
          }
        },
        activated(){
          //获取错误重定向的请求参数
          let errorCode = this.$route.query.errorCode;
          if(errorCode==55000){
             this.showErrorDialog = true;
          }

        	this.menuList = [];
        	this.serviceMoney = 0;
        	this.hot = null;
        	this.isSoySauce = false;
        	this.isSalt = false;
        	this.isVinegar = false;
        	this.isCoriander= false;
        	this.isOnion = false;
        	this.remarkInput = "";

          this.showTipDialog = false;

        	this._detailFoods();
        	//获取服务费
        	this._getServiceCharges();

        	//是否有发票设置
        	this._getInvoiceSet();
        },
        methods: {
        	ask(){
        		this.$refs.cleanCart.showFlag = true;
        	},
        	selectTaste(option){
	    		if(option == 'soySauce'){
	    			this.isSoySauce = !this.isSoySauce;
	    		}

	    		if(option == 'salt'){
	    			this.isSalt = !this.isSalt;
	    		}

	    		if(option == 'vinegar'){
	    			this.isVinegar = !this.isVinegar;
	    		}

	    		if(option == 'coriander'){
	    			this.isCoriander = !this.isCoriander;
	    		}

	    		if(option == 'onion'){
	    			this.isOnion = !this.isOnion;
	    		}
        	},
        	selectHot(option){
        		this.hot = option;
        	},
        	weixinPay(){

            
            this.start = true;
        		this.showTipDialog = false;
        		// //提交表单
        		this.commitOrder();
        	},

        	showTip(){
        		//判断发票开关状态,如果开着,验证是否填写
        		if(this.showInvoice && this.showInvoiceWrite){
                     if(this.isCom){//输入发票抬头
                        if(this.invoiceHeader==""){
                            Toast("请输入发票抬头");
                            return;
                        }
                    }
                    if(this.isEtc){//输入邮箱
                        if(this.email==""){
                            Toast("请输入邮箱");
                            return;
                        }else{
                            let emailRegualr = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
                            if(!emailRegualr.test(this.email)){
                                Toast("邮箱格式不正确,请重新输入");
                                return;
                            }
                        }
                    }
                }

                this.showTipDialog = true;
        	},
        	commitOrder(){
        		let _this = this;

                //备注
                let _hotStr = "";     //存储辣味属性
                if(_this.hot=="nohot"){
                    _hotStr = "不要辣,";
                }else if(_this.hot=="littleHot"){
                    _hotStr = "少放辣,";
                }else if (_this.hot=="moreHot"){
                    _hotStr = "多放辣,";
                }
                let _tasteStr = "";
                if(this.isSoySauce){
                	_tasteStr += "少放酱油,";
                }

                if(this.isSalt){
                	_tasteStr += "少放盐,";
                }

                 if(this.isVinegar){
                	_tasteStr += "多点醋,";
                }

                 if(this.isCoriander){
                	_tasteStr += "不要香菜,";
                }

                 if(this.isOnion){
                	_tasteStr += "不要洋葱,";
                }

                if(this.remarkInput){
                	this.remarkAllStr = _hotStr + _tasteStr +"!@#" + this.remarkInput;
                }else{
                	this.remarkAllStr = _hotStr + _tasteStr;
                }

                if(this.showInvoiceWrite){
                  this.invoiceHeader = this.isCom ? this.invoiceHeader : "";
                  this.email = this.isEtc ? this.email : "";
                  if(this.isPaper){//纸质
                      if(this.isCom){//公司
                          this.invoiceType = 3;//公司纸质
                      }else{
                          this.invoiceType = 1;//个人纸质
                      }
                  }else{//电子
                      if(this.isCom){//公司
                          this.invoiceType = 4;//公司电子
                      }else{
                          this.invoiceType = 2;//个人电子
                      }
                    }
              }else{
                  this.invoiceType = 0;
                  this.invoiceHeader = "";
                  this.email = "";
              }


              const token = localStorage.getItem("token");
    			    const localOrderId = localStorage.getItem("orderId");
              console.log("localOrderId:"+ localOrderId);
    			    const storeId = localStorage.getItem("storeId");
    			    const tableId = localStorage.getItem("tableId");

                let _formData = {
                    order: {
                        orderId :localOrderId,
                        storeId : storeId,
                        tableId : tableId,
                        remark:this.remarkAllStr,
                        isInvoice:this.showInvoiceWrite ? 1 : 0,
                        invoiceType:this.invoiceType,
                        invoiceHeader:this.invoiceHeader,
                        email:this.email,
                        activityType:this.activeType,
                        paidMoney:this.paidMoney,
                        noDiscountMoney:0,
                        paidDiscountMoney:this.discountNum,
                        orderDiscount:this.activeType?0:1,
                        activityName:this.discountContent
                    },
                    menusId: this.menuList,
                    // menusItemIdAttribute:itemIdMap,
                    serviceChargeDate:this.serviceCharges
                }
                _formData = JSON.stringify(_formData);
                console.log("_formData:"+ _formData);

                 this.$http({
                    method:'post',
                    url:'/fastfood/commitOrder',
                    headers: {
                        'Authorization':'Basic '+ token,
                        "content-type" : "application/json"
                    },
                    data:_formData
                }).then((response) => {
                    if(response.data.code==SUCCESS){
                    	const orderId = response.data.order.orderId;
                      localStorage.setItem("orderId",orderId);

                      localStorage.setItem("parentType","pay");
                      // const token = localStorage.getItem("token");
                      // const totalMoney = localStorage.getItem("finalTotalPrice");
                      window.location.href=response.data.url;

                    }else{
                        Toast(response.data.message);
                    }
                });
        	},
        	switchInvoice(){
       //  		if(!this.isOpen){
       //  			this.showInvoice = true;
       //  		}else{
       //  			this.showInvoice = false;
       //  		}
    			// this.isClose = !this.isClose;
    			// this.isOpen = !this.isOpen;
    			console.log("openInvoice:"+this.openInvoice);

    			this.showInvoice = !this.showInvoice;
        	},
        	selectType(){
    				this.isPaper =true;
    				this.isEtc =false;
        	},

        	selectType2(){
    				this.isEtc =true;
    				this.isPaper =false;
        	},
        	selectTitle(){
    				this.isCom =true;
    				this.isPerson =false;
        	},

        	selectTitle2(){
    				this.isPerson =true;
    				this.isCom =false;
        	},
        	_detailFoods(){
        		let _this = this;
        		let _sessionData = JSON.parse(localStorage.getItem("selectFoods"));
	            //计算菜品价格
	            _sessionData.forEach((item) => {
	                let _attribute = item.attribute;
	                let _id = item.menusItemId;
	                let _menusItemId ="";
	                let _attributeItemsId = "";
	                let _price = item.price * item.count;
	                let _count = item.count;
	                if(_attribute){ //有属性
	                    _attribute.forEach((subItem) => {
	                         if(subItem.count){
	                            _menusItemId = subItem.menusItemId+":"+subItem.dishesPropertyItem.itemName;
	                            _attributeItemsId = subItem.menusItemId+":"+subItem.itemId;
	                            _price = subItem.money * subItem.count;
	                            _count = subItem.count;
	                            let obj = {
	                                id: _id,
	                                number: _count,
	                                money: subItem.money,
	                                itemName: item.dishesName + "(" + subItem.dishesPropertyItem.itemName + ")",
	                                menusItemId: _menusItemId,
	                                attributeItemsId: _attributeItemsId,
	                                sort: item.dishesSortId,  //菜品分类id
	                                pageSortId: subItem.id,  //菜品属性分类id
	                                itemId: subItem.itemId   //菜品属性id
	                            }
	                            _this.menuList.push(obj);
	                        }
	                    })
	                }else{  //无属性
	                    let obj = {
	                        id: _id,
	                        number: _count,
	                        money: item.price,
	                        itemName: item.dishesName,
	                        sort: item.dishesSortId //菜品分类id
	                    }
	                    _this.menuList.push(obj);
	                }
	            })

	            window.localStorage.setItem('detailFoods',JSON.stringify(_this.menuList));

        	},
        	_calculateTotal(){
    		    let total = window.localStorage.getItem('total');
	          let totalPrice = window.localStorage.getItem('totalPrice');

	      	  totalPrice = Number(totalPrice) + Number(this.serviceMoney);
	      	  this.totalPriceOrigin = totalPrice;

	      	  let hasDiscount = false;
	      	  let discountContent = null;
	      	  let discountNum =0;
	      	  let discount = window.localStorage.getItem('discount');

	      	  if(discount != null && discount != "" && discount != undefined){
	      	  	discount = JSON.parse(discount);
	      	  	hasDiscount = true;
	      	  	discountContent = discount.name;

	      	  	this.activeType = discount.type;
	      	  	let type = discount.type;
	      	  	let params = discount.params;
	  	  		params = JSON.parse(params);
	      	  	if(type == 1){
	      	  		console.log("allprice:"+params.allprice);
	      	  		if(totalPrice >= params.allprice){
	      	  			discountNum = Number(params.jianprice);
	      	  		}

	      	  	}else{
	      	  		console.log("discount:"+params.discount);
	      	  		let rate = Number(params.discount);
	      	  		let minusPrice = (Math.round(totalPrice*(100-rate))/100).toFixed(2);
	    			    discountNum = minusPrice;
	      	  	}

	      	  }

	      	  console.log("hasDiscount:"+hasDiscount);
	      	  console.log("discountContent:"+discountContent);

	      	  totalPrice = totalPrice - discountNum;
	      	  console.log("最后的总价:"+totalPrice.toFixed(2));
	      	  window.localStorage.setItem('finalTotalPrice',totalPrice.toFixed(2));

            this.paidMoney = totalPrice.toFixed(2);

	      	  this.total = total;
	      	  this.totalPrice = totalPrice;
	      	  this.hasDiscount = hasDiscount;
	      	  this.discountContent = discountContent;
	      	  this.discountNum =discountNum;
        	},
        	_getServiceCharges(){
        	  let menusId = window.localStorage.getItem('menusId');
            if(menusId == null || menusId == undefined){
              menusId = "";
            }
            console.log("传参menusId:"+menusId);
	      	  const _this = this;
	      	  this.$http.get(
		        '/fastfood/storeServiceCharge?menusId='+menusId, //menusId:210
		        ).then((response) => {
		            if(response.data.code == SUCCESS){
		            	_this.serviceCharges = response.data.model;
	                    //计算附加费的总价格
	                    if(_this.serviceCharges && _this.serviceCharges.length > 0){
	                    	_this.showService = true;
	                        for(var i=0;i<_this.serviceCharges.length;i++){
	                            _this.serviceMoney += _this.serviceCharges[i].money;
	                        }
	                        console.log("_this.serviceMoney:"+_this.serviceMoney);
	                    }
	                    //计算总价
	                    _this._calculateTotal();
		            }
		        });
        	},
        	_getInvoiceSet(){
        		const storeId = window.localStorage.getItem('storeId');
        		const _this = this;
        		this.$http.get(
        		'/fastfood/couldPrinInvoice?storeId='+storeId,  //storeId:343
                ).then((response) => {
                    if(response.data.code == SUCCESS){
                    	if(response.data.model){
	                        let _isInvoice = response.data.model.isInvoice;  //1开通了发票
	                        let _type = response.data.model.ticketType;  //0所有，1电子发票，2纸质发票
	                        if(_isInvoice == 1){
	                            _this.showInvoice = true;
	                            if(_type && _type==1){  //只配置电子发票
	                                _this.supportPaper = false;
	                                _this.isEtc = true;
	                            }else if(_type&&_type==2){
	                                _this.supportEtc = false;
	                                _this.isPaper = true;
	                            }
	                        }else{
	                            this.showInvoice = false;
	                        }

	                        //获取已有发票信息
	                        this._getInvoice(_type);
                    	}
                    }
                });
        	},
        	_getInvoice(invoiceType){
        		const _this = this;
        		const token = window.localStorage.getItem('token');
        	    this.$http({
                    method:'get',
                    url:'/fastfood/latelyRiseInvoice',
                    headers: {'Authorization':'Basic '+ token },
                    params:{
                        invoiceType:invoiceType
                    }
                }).then((response) => {
                    if(response.data.code== SUCCESS){
                    	if(response.data.model){
	            		    _this.invoiceHeader = response.data.model.invoiceHeader;
	                        _this.email = response.data.model.email;
                    	}
                     
                    }
                });
        	}
        },
       components: {
          weuiHeader,
          cleanCart
       }
      
    };
</script>

<style lang="less" scoped>
.order-confirm {
	margin-top: 10px;
	padding-top: 45px;
	padding-bottom: 50px;

	.tablecode {
		height: 50px;
		line-height: 50px;
		background: white;
		padding: 0 10px;
	}

	.dishes-content {
		margin-top: 10px;
	}

  .bottom-line {
    height: 100%;
    position: relative;
    &:before {
      content: " ";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      border-bottom: 1px solid #dedede;
      color: #dedede;
      -webkit-transform-origin:0 100%;
      transform-origin:0 100%;
      -webkit-transform: scaleY(0.5);
      transform: scaleY(0.5);
    }
  }

	.total-clean {
		padding: 0 10px;
		height: 40px;
		line-height: 40px;
		background: #fbfbfb;
	}

	.dishes-item {
		background: white;
		padding: 0 10px;
	}

	.dishes-item ul {
		height: 40px;
		line-height: 40px;
	}

	.dishes-item ul li {
		float: left;
		display: block;
	}

	.discount-info {
		height: 46px;
		line-height: 45px;
		padding: 0 10px;
		background: white;
	}

	.discount-icon {
		width: 16px;
		height: 14px;
		display: inline-block;
		vertical-align: middle;
	}

	.total-count {
		height: 50px;
		line-height: 50px;
		background: white;
		padding: 0 10px;
		clear:both;
	}

	.order-remark {
		margin-top: 10px;
		background: white;
		padding: 0 10px;
	}

	.remark-title {
		height: 40px;
		line-height: 40px;
	}

	.taste-options {
		margin-top: 15px;
		color: #999;
	}

	.group-select {
		width: 212px;
		height: 26px;
		line-height: 25px;
		border-radius: 4px;
		position: relative;
		float:left;
	}

	.group-option {
		float: left;
    width: 33.3%;
		text-align: center;
		border: 1px solid #b1b1b1;
	}

	#option1 {
		border-right: none;
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	#option2 {
		border-left: none;
		border-right: none;
	}

	#option3 {
		border-left: none;
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}

	.vertical-line {
		display: block;
		position: absolute;
		top: 0;
		height: 26px;
		border-right: 1px solid #b1b1b1;
	}

	#line1 {
		left: 70px;
	}

	#line2 {
		right: 70px;
	}

	.taste-options ul {
		height: 26px;
	} 
	.taste-options li {
		float: left;
		margin-right: 10px;
	}
	.taste-options button{
		border: 1px solid #b1b1b1;
		border-radius: 4px;
		color: #999;
		padding: 0 10px;
		height: 26px;
	}

	.current-taste {
		border-color: #11bbb4!important;
		color: #00a9a2!important;
	}

	.current-hot {
		border-color: #11bbb4!important;
		color: #00a9a2!important;
	}

	.mt10{
		margin-top: 10px;
	}

	.other-demand {
		padding: 15px 0;
		background: white;
	}

	.custom-input {
		height: 34px;
		width: 100%;
		padding-left: 12px;
		background: #f1f1f1;
		display: block;
	}

	.invoice {
		margin-top: 10px;
		background: white;
		padding: 0 10px;
	}

	.switch {
		width: 45px;
		height: 28px;
		vertical-align: middle;
	}

	.switch-close {
		background: url("../images/switch_close.png") no-repeat;
		background-size: 100% 100%;
	}

	.switch-open {
		background: url("../images/switch_open.png") no-repeat;
		background-size: 100% 100%;
	}

	.invoice-switch {
		width: 100%;
		position:relative;
		height: 50px;
		line-height: 50px;
	}

	.invoice-write {
		padding: 15px 10px 10px;
		background: white;

		.invoice-type {
			margin-bottom:20px;
			* {
				display:inline-block;
			}

			.option {
				display: inline-block;
				width: 16px;
				height: 16px;
				vertical-align: text-bottom;
			}
			.type-tick{
				background: url("../images/checkbox-tick.png") no-repeat;
				background-size: 100% 100%;
			}

			.type-circle {
				background: url("../images/checkbox-default.png") no-repeat;
				background-size: 100% 100%;
			}
		}
	}

	.weixin-pay {
		height: 50px;
		width: 100%;
		background: white;
		position: fixed;
		z-index: 100;
		left: 0;
		bottom: 0;
		padding: 0 10px;
	}

	.weixin-pay:before{
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		border-bottom: 1px solid #BCBAB6;
		color: #BCBAB6;
		-webkit-transform-origin:0 100%;
		transform-origin:0 100%;
		-webkit-transform: scaleY(0.5);
		transform: scaleY(0.5);
	}

	.pay-btn {
		height: 38px;
		width: 145px;
		border-radius: 4px;
		background: #11bbb4;
		color: white;
		font-size: 16px;
		vertical-align: middle;
	}

	 .pay-finish-dialog {
	 	  position:fixed;
    	width: 85%;
      height: 340px;
	    top: 0;
	    left: 0;
      right: 0;
      bottom: 0;
      margin: auto;
	    background-color: white;
	    text-align: center;
	    border-radius: 3px;
	    border-radius: 2px;
	    z-index: 210;
	    padding-bottom: 20px;

       .title {
       		height:50px;
       		line-height: 50px;
       		border-bottom: 1px dashed #BCBAB6;

       		* {
       			display: inline-block;
       			vertical-align: middle;
       		}

       		.title-line {
       			width: 20px;
       			border-bottom: 1px solid #cacaca;
       		}

       		.title-tip{
       			margin: 0 10px;
       		}
       	
       }

       .pay-finish-tip {
       		width: 100%;
       		height: auto;
       		display:block;
       		margin: 20px auto;
       }

       .dialog-btn {
       		width: 80%;
       		height: 40px;
       		background: #11bbb4;
       		letter-spacing: 2px;
       		font-size: 18px;
       		color: white;
       		border-radius: 3px;
       }
	 }

	 .bg-layer {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.5);
		z-index: 200;
	}

  .error-modal {
    width: 80%;
    height: 120px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: #fff;
    border-radius: 4px;
    z-index: 210;
    text-align: center;
    padding-top: 20px;
    font-size: 16px;

    button {
      display: block;
      width: 80%;
      height: 36px;
      border-radius: 4px;
      background: #11bbb4;
      color: #fff;
      margin: 0 auto;
      margin-top: 20px;
    }
  }

}
	
</style>